<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
    <head>
        <link rel="icon" type="image/png" href="<?php echo img_url(); ?>favicon.png" />
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title><?php echo $title; ?></title>
        <!--[if lt IE 9]>
         <script src="<?php echo js_url(); ?>/html5shiv.js"></script>
        <![endif]-->
        <meta name="description" content="<?php echo $description; ?>" />
        <meta name="keywords" content="<?php echo $keywords; ?>" />
        <link href="<?php echo css_url(); ?>bootstrap/css/bootstrap.css" rel="stylesheet" type="text/css" media="screen" />
        <!--<link href="<?php echo css_url(); ?>bootstrap/css/reset.css" rel="stylesheet" type="text/css" media="screen" />-->
        <!--<link href="<?php echo css_url(); ?>bootstrap/css/text.css" rel="stylesheet" type="text/css" media="screen" />-->
        <!--<link href="<?php echo css_url(); ?>wfaces.css" rel="stylesheet" type="text/css" media="screen" />-->
        <link href="<?php echo css_url(); ?>chat.css" rel="stylesheet" type="text/css" />
        <link href="<?php echo css_url(); ?>bootstrap/datepicker.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript"  src="<?php echo js_url(); ?>jquery.min.js">
        </script>
<!--        <script type="text/javascript"  src="<?php echo js_url(); ?>qtip/jquery.qtip.min.js">
        </script>-->
        <script type="text/javascript"  src="<?php echo js_url(); ?>datepicker.js">
        </script>
        <!--<link href="<?php echo css_url(); ?>qtip/jquery.qtip.min.css" rel="stylesheet" type="text/css" />-->
<!--        <script src="http://connect.facebook.net/en_US/all.js"></script>-->
    </head>
    <body>
        <div class="container">
            <div class="row">
                <div class="span12">
                    <div class="span3" style="margin-left:0px">
                        <img class="logo" src="<?php echo img_url() . "wfaces4.1.png"; ?>" />
                    </div>
                    <div class="span4"></div>
                    <div class="span3" style="margin-bottom: 0px;">

                    </div>

                    <div  class="span2">
                        <div style="width: 100px; min-height: 20px; cursor: pointer"
                             class="session" id="signIn">
                                <!--<img src="" width="25px" height="25px" />-->
                            <span>
                                Sign in
                            </span>
                            <img src="<?php echo img_url() . "arrow.png"; ?>"/>
                        </div>
                    </div>

                    <div style="display: none;" id="sessionUser" class="span2">
                        <a href="#">
                           <!--<img src="<?php echo css_url("chat/with") . "../pht/" . $user->tof; ?>" width="25px" height="25px" />-->
                            <span class="connected-user">
                                Sign In
                            </span>
                            <img src="<?php echo img_url() . "arrow.png"; ?>"/>
                        </a>
                    </div>

                    <!-- end .span12 -->
                </div>
            </div>
            <div class="row">
                <div class="span12 hr">
                    &nbsp;
                </div>
            </div>

            <!--            <div class="row">
                            <div class="span12" style="text-align: center;" id="facebook_connect">
                                <br/>
                                <fb:login-button show-faces="false" height="100px" perms="email,user_birthday,read_stream">
                                    Connect with Facebook
                                </fb:login-button>
                            </div>
                        </div>-->
            <div class="row">
                <div  style="height:50px; "></div>
                <div class="span6" style="color: #0e385f;
                     font-size: 20px;
                     line-height: 29px;
                     margin-top: 0px;
                     width: 450px;
                     word-spacing: -1px;
                     text-align: justify;
                     display: none;">
                    Bienvenue sur wfaces!
                    <br/><br/>
                    Wfaces est un site web 2.0 qui vous permet de discutter en toute liberté et de trouver facilement de nouveaux amis à travers le monde !
                    <br/><br/>
                    N'hésitez pas à vous y inscrire pour découvrir ses fonctionnalités simples et innovantes, <b> Vous pouvez à tout moment désactiver ou supprimer définitivement votre compte!</b>
                    <br/><br/>
                    Utilisez wfaces en : <a>english</a> | <a>français</a> | <a>عربية</a>
                    <br/><br/>
                </div>
                <div class="span6" style="color: #0e385f;
                     font-size: 20px;
                     line-height: 29px;
                     margin-top: 0px;
                     width: 450px;
                     word-spacing: -1px;
                     text-align: justify">
                    Welcome to wfaces!
                    <br/><br/>
                    wfaces is a web 2.0 site that allows you to speak freely and easily find new friends worldwide!
                    <br/><br/>
                    Do not hesitate to sign up to discover his simple and innovative features, you can at any time deactivate or delete your account!
                    <br/><br/>
                    Use wfaces in: <a>english</a> | <a>français</a> | <a>عربية</a>
                    <br/><br/>
                    <span style="font-size: 13px;">Like our facebook page : </span>

                    <div class="row">
                        <div class="span6">
                            <div id="fb-root">

                            </div>

                            <!--
                            <div class="fb-like" data-href="https://www.facebook.com/wfaces" data-width="450" data-show-faces="true" data-send="true">
                            </div>
                            -->

                        </div>
                    </div>
                </div>
                <div class="span6 rounded" style="border-left: 1px solid #ccc">
                    <?php
                    $this->load->view($view);
                    ?>
                </div>
            </div>
            <div style="height:30px;">
                &nbsp;
            </div>
            <div class="row" >
                <div class="span12" style="font-size: 14px; margin-top: 0px; padding-top: 10px; border-top:1px solid #bdc7d8; text-align: center">
                    &copy;2013 wfaces
                </div>
            </div>
            <div style="height:0px;">
                &nbsp;
            </div>
        </div>
        <!-- end .container_12 -->
        <div id="tooltip-signin" style="display: none;">
            <?php
            $this->load->view("v_login");
            ?>
        </div>
    </body>
    <script type="text/javascript"  src="<?php echo js_url(); ?>qtip2/jquery.qtip.min.js">
    </script>
    <link href="<?php echo css_url(); ?>qtip2/jquery.qtip.min.css" rel="stylesheet" type="text/css" />

    <script>
        $(document).ready(function() {
            $(".birthday").datepicker({format: 'dd/mm/yyyy'});
            $('#signIn').qtip({
                content: {
                    text: $('#tooltip-signin') // Use the "div" element next to this for the content
                },
                position: {
                    my: 'top right',  // Position my top left...
                    at: 'bottom center', // at the bottom right of...
                    target: $('#signIn') // my target
                },
                style: {
                    classes: 'qtip-blue qtip-bootstrap',
                    width : '300'
                },
                show: {
                    event: 'click'
                },
                hide: {
                    event: null,
                    fixed: true
                },
                events: {
                    show: function() {
                        // Tell the tip itself to not bubble up clicks on it
                        $($(this).qtip('api').elements.tooltip).click(function(event) { event.stopPropagation(); });
                        // Tell the document itself when clicked to hide the tip and then unbind
                        // the click event (the .one() method does the auto-unbinding after one time)
                        $(document).one("click", function() { $("#signIn").qtip('hide'); });
                    }
                }
            });

            // A bit better. Grab elements with a title attribute that isn't blank.
            //            /*********************Fb init when document is ready*****************/
            //            FB.init({
            //                appId: '1404596496425147',
            //                status: true, // verifie le statut de la connexion
            //                cookie: true, // active les cookies pour que le serveur puisse accéder à la session
            //                xfbml: true  // active le XFBML (HTML de Facebook)
            //            });
            //
            //            (function(d, s, id) {
            //                var js, fjs = d.getElementsByTagName(s)[0];
            //                if (d.getElementById(id))
            //                    return;
            //                js = d.createElement(s);
            //                js.id = id;
            //                js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=1404596496425147";
            //                fjs.parentNode.insertBefore(js, fjs);
            //            }(document, 'script', 'facebook-jssdk'));
            //
            //            FB.Event.subscribe('auth.login', function(response) {
            //                FB.api('/me', function(response) {
            //                    console.log(response);
            //                });
            //
            //                //                $('#facebook_button_box').hide();
            //                //                $('#facebook_profile').show();
            //            });
            //
            //            FB.getLoginStatus(function(response) {
            //                if (response.session) {
            //                    FB.api('/me', function(response) {
            //                        consolde.log(response)
            //                    });
            //                    $('#facebook_button_box').hide();
            //                    $('#facebook_profile').show();
            //                }
            //            });
            //
            //            $('#facebook_logout').live('click', function() {
            //                FB.logout(function(response) {
            //                    $('#facebook_button_box').show();
            //                    $('#facebook_profile').hide();
            //                });
            //
            //                return false;
            //
            //            });
        });
    </script>
</html>
